<template>
  <div id="navbar20180719">
    <!-- 导航条 2018/7/19 zhangQ -->
    <div style="height: 25px;background: #4585f5;position: fixed;top:0;left:0 ;right: 0;z-index: 300"></div>
    <mu-appbar color="primary" style="width: 100%;height: 45px;position: fixed;top:25px;left:0 ;right: 0;z-index: 200" :z-depth="1">
      <template slot="left">
        <slot name="left">
          <mu-button icon @click="backPage">
            <mu-icon size="36" value="keyboard_arrow_left"></mu-icon>
          </mu-button>
        </slot>
      </template>

      <slot>
        {{activeMenu.title}}
      </slot>

      <template slot="right">
        <slot name="right">
          <mu-menu>
            <mu-button icon>
              <mu-icon size="36" value="more_horiz"></mu-icon>
            </mu-button>
          </mu-menu>
        </slot>
      </template>
    </mu-appbar>
    <div style="height: 70px;background: #4585f5"></div>
  </div>
</template>

<script>
  import { mapGetters } from 'vuex'

  export default {
    name: 'index',
    data () {
      let datas = {}
      return datas
    },
    computed: {
      ...mapGetters(['activeMenu'])
    },
    methods: {
      backPage () {
        this.$router.go(-1)
      }
    },
    created () {
    },
    mounted () {
    },
    components: {}
  }
</script>

<style scoped>

</style>
